<!doctype html>
<!--[if lt IE 7 ]><html class="ie ie6" lang="en"> <![endif]-->
<!--[if IE 7 ]><html class="ie ie7" lang="en"> <![endif]-->
<!--[if IE 8 ]><html class="ie ie8" lang="en"> <![endif]-->
<!--[if (gte IE 9)|!(IE)]><!--><html lang="en"> <!--<![endif]-->
<head>
<meta charset="utf-8">

<!--
••••••••••••••••••••••••

Powered by Type & Grids™
www.typeandgrids.com

••••••••••••••••••••••••
-->

<title>Curiositá &mdash; ProyectoMultimedia</title>
<meta name="description" content="Los eventos más curiosos de la ciudad de Bogotá.">
<meta name="author" content="Dina Martínez - Johanna Durán - Ma. Claudia Licona">
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">


<!-- CSS
================================================================================================= -->
<link rel="stylesheet" href="css/base.css">
<link rel="stylesheet" href="css/themes/type_04.css">
<link rel="stylesheet" href="css/themes/color_13.css">

<!--[if lt IE 9]>
	<script src="http://html5shim.googlecode.com/svn/trunk/html5.js"></script>
<![endif]-->

<!-- Favicons
================================================================================================= -->
<link rel="shortcut icon" href="images/favicons/favicon.ico">
<link rel="apple-touch-icon" href="images/favicons/apple-touch-icon.png">
<link rel="apple-touch-icon" sizes="72x72" href="images/favicons/apple-touch-icon-72x72.png">
<link rel="apple-touch-icon" sizes="114x114" href="images/favicons/apple-touch-icon-114x114.png">

<!-- JS
================================================================================================= -->
<script src="js/libs/modernizr.min.js"></script>
<script src="js/libs/jquery-1.8.3.min.js"></script>
<script src="js/libs/jquery.easing.1.3.min.js"></script>
<script src="js/libs/jquery.fitvids.js"></script>
<script src="js/script.js"></script>

</head>
<body>

<!-- Write preloader to page - this allows the site to load for users with JS disabled -->
<script type="text/javascript">
	document.write("<div id='sitePreloader'><div id='preloaderImage'><img src='images/site_preloader.gif' alt='Preloader' /></div></div>");
</script>

<div class="container">
	
	<!-- Header begins ========================================================================== -->
<header>
		<div id="logo">
			<a href="index.html"><img src="images/logo.png" alt="Logo Curiositá"></a>
		</div>
		<nav>
			<ul>
				<li><a href="index.html">Home</a></li>
				<li><a href="Quienes-somos.html">¿Quiénes somos?</a></li>
				<li><a href="ranking.html">Ranking</a></li>
				<li><a href="apoyos.html">Apoyos</a></li>
				<li><a href="contacto.html">Contacto</a></li>
				<!--<li><a href="http://wordpress.org" target="_blank">Blog</a></li>-->
			</ul>
		</nav>
		<hr />
	</header>
	<!-- Header ends ============================================================================ -->



	
	<div id="work">

			<!-- abajo de aquí va la animación en flash ======================================================================= -->

<div id="anivideo">
					<div id="animacion">
						<h4>Animaciín + Avatar + Tour</h4>
						<h5>En flash</h5>
						<img src="images/projects/project_02_desaturated.jpg" alt="Project 02" class="thumbnailImage" />
					</div>
					

	<!-- abajo de aquí va El vídeo ======================================================================= -->

					<div id="videocurioso">
						<h4>Video lo más curioso de la semana</h4>
						<h5>Lo grabaremos en una localidad representativa de bogotá</h5>
						<img src="images/projects/project_02_desaturated.jpg" alt="Project 02" class="thumbnailImage" />
					</div>
					
		</div>


		<hr />
	
		<div id="overview" class="sixteen columns">
			<h3>Bogotá territorio experimental. ¡Vívela!</h3>
			<hr />
		</div>
		

		

		<div class="eight columns" id="col1">
		
			<!-- Categoria 1= gastronomía ================================================================= -->
			<div class="project">
				
				<div class="projectThumbnail">
					<svg class="thumbnailMask"></svg>
					<div class="projectThumbnailHover">
						<h4>Gastronomía</h4>
						<h5>Subtitulo de la categoría 1 a la que hemos denomidado gastronomia</h5>
					</div>
					
					<img src="images/projects/project_01_desaturated.jpg" alt="Project 01" class="thumbnailImage" />
				</div>
				
				<div class="projectInfo">
					<h4>Gastronomía</h4>
					<div class="projectNavCounter"></div>
					<div class="projectNav">
						<div class="projectNavEnlarge"><button class="enlargeButton" onClick="window.location.href='categorias/gastronomia/categoria-gastronomia.html'"><span>Ir a esta Categoría</span></button></div>
						<div class="projectNavClose"><button class="closeButton">Close</button></div>
						<div class="projectNavButtons"><button class="prev"></button><button class="next"></button></div>
					</div>
					<p>
						This is a description of the project. This text is optional and the site layout works fine without it. The slider above (included in the Pro version only) is swipe-enabled with hardware accelerated transitions so it works super-smoothly on touch devices like the iPhone and iPad.
					</p>
					<ul>
						<li><strong>Realización:</strong> Imasonus</li>
						<li><strong>Equipo:</strong> Johanna Durán - Diana Martinez - Ma. Claudia Licona</li>
						<li><strong>Año:</strong> 2014</li>
					</ul>
				</div>
				
			</div>
			<!-- Fin Categoria 1 = Gastronomía =================================================================== -->
			
			<!-- Categoria 2= antiguedades ================================================================= -->
			<div class="project">
				
				<div class="projectThumbnail">
					<svg class="thumbnailMask"></svg>
					<div class="projectThumbnailHover">
						<h4>Antiguedades</h4>
						<h5>Optional Hover Subtitle</h5>
					</div>
					<img src="images/projects/project_02_desaturated.jpg" alt="Project 02" class="thumbnailImage" />
				</div>
				
				<div class="projectInfo">
					<h4>Project 02 Title Goes Here</h4>
					<div class="projectNavCounter"></div>
					<div class="projectNav">
						<div class="projectNavEnlarge"><button class="enlargeButton" onClick="window.location.href='categorias/antiguedades/categoria-antiguedades.html'">Ir a esta Categoría</button></div>
						<div class="projectNavClose"><button class="closeButton">Close</button></div>
						<div class="projectNavButtons"><button class="prev"></button><button class="next"></button></div>
					</div>
					
					<p>
						This is a description of the project. This text is optional and the site layout works fine without it. The slider above (included in the Pro version only) is swipe-enabled with hardware accelerated transitions so it works super-smoothly on touch devices like the iPhone and iPad.
					</p>
					<ul>
						<li><strong>Realización:</strong> Imasonus</li>
						<li><strong>Equipo:</strong> Johanna Durán - Diana Martinez - Ma. Claudia Licona</li>
						<li><strong>Año:</strong> 2014</li>
					</ul>
				</div>
				
			</div>
			<!-- Fin Categoria 2 = Antiguedades =================================================================== -->
			
			<!-- Categoria 3 = Actividades nocturnas ================================================================= -->
			<div class="project">
				
				<div class="projectThumbnail">
					<svg class="thumbnailMask"></svg>
					<div class="projectThumbnailHover">
						<h4>Actividades Nocturnas</h4>
						<h5>Optional Hover Subtitle</h5>
					</div>
					<img src="images/projects/project_03_desaturated.jpg" alt="Project 03" class="thumbnailImage" />
				</div>
					
				<div class="projectInfo">
					<h4>Project 03 Title Goes Here</h4>
					<div class="projectNavCounter"></div>
					<div class="projectNav">
						<div class="projectNavEnlarge"><button class="enlargeButton" onClick="window.location.href='categorias/nocturna/categoria-actividadesnocturnas.html'">Ir a esta Categoría</button></div>
						<div class="projectNavClose"><button class="closeButton">Close</button></div>
						<div class="projectNavButtons"><button class="prev"></button><button class="next"></button></div>
					</div>
					<p>
						This is a description of the project. This text is optional and the site layout works fine without it. The slider above (included in the Pro version only) is swipe-enabled with hardware accelerated transitions so it works super-smoothly on touch devices like the iPhone and iPad.
					</p>
					<ul>
						<li><strong>Realización:</strong> Imasonus</li>
						<li><strong>Equipo:</strong> Johanna Durán - Diana Martinez - Ma. Claudia Licona</li>
						<li><strong>Año:</strong> 2014</li>
					</ul>
				</div>
				
			</div>
			<!-- Fin categoria 3 =================================================================== -->
			
			<!-- Categoria 4 Sitios Aledaños ================================================================= -->
			<div class="project">
				
				<div class="projectThumbnail">
					<svg class="thumbnailMask"></svg>
					<div class="projectThumbnailHover">
						<h4>Sitios aledaños</h4>
						<h5>Optional Hover Subtitle</h5>
					</div>
					<img src="images/projects/project_04_desaturated.jpg" alt="Project 04" class="thumbnailImage" />
				</div>
					
				<div class="projectInfo">
					<h4>Project 04 Title Goes Here</h4>
					<div class="projectNavCounter"></div>
					<div class="projectNav">
						<div class="projectNavEnlarge"><button class="enlargeButton" onClick="window.location.href='categorias/aledaños/categoria-sitiosaledaños.html'">Ir a esta Categoría</button></div>
						<div class="projectNavClose"><button class="closeButton">Close</button></div>
						<div class="projectNavButtons"><button class="prev"></button><button class="next"></button></div>
					</div>
					<p>
						This is a description of the project. This text is optional and the site layout works fine without it. The slider above (included in the Pro version only) is swipe-enabled with hardware accelerated transitions so it works super-smoothly on touch devices like the iPhone and iPad.
					</p>
					<ul>
						<li><strong>Realización:</strong> Imasonus</li>
						<li><strong>Equipo:</strong> Johanna Durán - Diana Martinez - Ma. Claudia Licona</li>
						<li><strong>Año:</strong> 2014</li>
					</ul>
				</div>
				
			</div>
			<!-- Fin categoria 4 =================================================================== -->
			
			<!-- Categoria 5 = Actividades verdes Al Aire ================================================================= -->
			<div class="project">
				
				<div class="projectThumbnail">
					<svg class="thumbnailMask"></svg>
					<div class="projectThumbnailHover">
						<h4>Actividades Verdes (Al aire)</h4>
					</div>
					<img src="images/projects/project_05_desaturated.jpg" alt="Project 05" class="thumbnailImage" />
				</div>
				
				<div class="projectInfo">
					<h4>Project 05 Title Goes Here</h4>
					<div class="projectNavCounter"></div>
					<div class="projectNav">
						<div class="projectNavEnlarge"><button class="enlargeButton" onClick="window.location.href='categorias/verde/categoria-actividadesverdes.html'">Ir a esta Categoría</button></div>
						<div class="projectNavClose"><button class="closeButton">Close</button></div>
						<div class="projectNavButtons"><button class="prev"></button><button class="next"></button></div>
					</div>
					<p>
						This is a description of the project. This text is optional and the site layout works fine without it. The slider above (included in the Pro version only) is swipe-enabled with hardware accelerated transitions so it works super-smoothly on touch devices like the iPhone and iPad.
					</p>
					<ul>
						<li><strong>Realización:</strong> Imasonus</li>
						<li><strong>Equipo:</strong> Johanna Durán - Diana Martinez - Ma. Claudia Licona</li>
						<li><strong>Año:</strong> 2014</li>
					</ul>
				</div>
				
			</div>
			<!-- Fin Categoria 5 =================================================================== -->
			
			<!-- El sexto item de la categoria debe llevar una foto para enlace de contactenos / suscribete a nuestro boletín de noticias ================================================================= -->

			<div class="project">
	<div id="textosuscribete">			
	<h3>Curiositá en tu e-mail <BR/>¡Suscríbete!</h3>
	</div>
				<div id="suscribete">
				<form>
<fieldset>
<p> Nombre : <input name="Nombre" type="text" value="ingrese su nombre" size="30px" maxlength="50"/> </p>
<p> Tu e-mail : <input name="Nombre" type="text" value="mail@tumail.com" size="30px" maxlength="50"/> </p>
<input type="submit" name="enviar" value="Suscribirme"/>
</fieldset>


</form>
					
				
				</div>
			</div>
			
			<!-- Project ends =================================================================== -->
			
		</div><!-- col1 -->
		
		<!-- Even numbered projects are dynamically moved into this second column via JS -->
		<div class="eight columns" id="col2">
		</div>
	
	</div>
	<!-- Work page ends ========================================================================= -->
	
	
	<!-- Footer begins ========================================================================== -->
	<footer class="sixteen columns">
		<hr />
		<ul id="footerLinks">
			<li>&copy; 2013 Ivan Designostrom. All rights reserved.</li>
			<li><a href="mailto:hello@ivandesignostrom.com">hello@ivandesignostrom.com</a></li>
			<li><a href="http://www.twitter.com" target="_blank">Twitter</a></li>
			<!--Notice: The "Powered by Type & Grids" link in the footer is required in the Free version. Upgrade to the Pro version if you would like to remove it. (www.typeandgrids.com/pirates) -->
			<li>Powered by <a href="http://www.typeandgrids.com" target="_blank">Type &amp; Grids</a></li>
		</ul>
	</footer>
	<!-- Footer ends ============================================================================ -->
		
</div><!-- container -->
</body>
</html>